<template>
  <div class="foot">
    <div class="text-card">撰写卡片...</div>
    <a class="audio-input">
      <label for="microphone" class="fa fa-microphone" aria-hidden="true"></label>
      <input id="microphone" type="file" accept="audio/*;capture=microphone">
    </a>
    <a class="camera-input">
      <label for="camera" class="fa fa-camera" aria-hidden="true"></label>
      <input id="camera" type="file" accept="image/*;capture=camera">
    </a>
  </div>
</template>
<script>
export default {
  data () {
    return {}
  }
}
</script>
<style scoped>
#microphone{
  display: none;
}
#camera{
  display: none;
}
.audio-input,
.camera-input{
  width: 54px;
  font-size: 28px;
}
.text-card{
  flex: auto;
  text-align: left;
}
  .foot{
    height: 60px;
    width: 100%;
    z-index: 10000;
    flex-shrink: 0;
    background-color: #6aa6b1;
    box-shadow: 0 -1px 2px #555555;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    color: white;
    padding-left: 5%;
    padding-right: 5%;
    font-size: 22px;
  }
</style>
